<!--资质证书管理-->
<div>
    <el-form  label-width="100%">
        <el-form-item label="">
        </el-form-item>
    </el-form>
    <div class="panel-parent">
        <div class="self">
                <el-form  :inline="true" :model="checkFormInline" class="demo-form-inline">
                    <el-row>
                        <el-col :span="14">
                            <el-form-item label=""  class = "transparent">
                                <el-button type="primary" @click="addCertificate">添加</el-button>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10">
                            <el-form-item label="姓名">
                                <el-input v-model="checkFormInline.userCnName" placeholder="姓名" style="width: 80px"></el-input>
                            </el-form-item>
                            <el-form-item label="身份证号">
                                <el-input v-model="checkFormInline.idNumber" placeholder="身份证号" style="width: 180px"></el-input>
                            </el-form-item>
                            <el-button type="primary" @click="checkCertificate">查询</el-button>
                        </el-col>
                    </el-row>
            </el-form>
            <kf-table
                    ref="baseTable"
                    :data="tableData"
                    one-screen
                    title="添加"
                    :close-on-click-modal=false
                    layout="total, sizes, prev, pager, next, jumper"
            >
                <el-table-column  prop="fwUserPo.userCnName" label="姓名" min-width="120" >
                </el-table-column>
                <el-table-column  prop="idNumber" label="身份证号" min-width="170" >
                </el-table-column>
                <el-table-column prop="certificate" label="资质证书" min-width="100">
                </el-table-column>
                <el-table-column prop="certificateAuth" label="发证机关" width="150">
                </el-table-column>
                <el-table-column prop="certificateDate" label="发证日期" width="150">
                </el-table-column>
                <el-table-column prop="certificateNum" label="证书编号" width="150">
                </el-table-column>
                <el-table-column prop="certificateIndate" label="有效期至" width="150">
                </el-table-column>
                <el-table-column prop="remarks" label="备注" width="150">
                </el-table-column>
                <el-table-column label="操作" fixed="right" width="220" >
                    <template scope="scope">
                        <el-button type="text" @click="uploadCertificate(scope)">上传文件</el-button>
                        <el-button type="text" @click="checkFile(scope)">查看证书</el-button>
                        <el-button type="text" @click="editCertificate(scope)">修改</el-button>
                        <el-button type="text" @click="deleteCertificate(scope)">删除</el-button>
                    </template>
                </el-table-column>
                <template slot="editForm">
                    <el-form :inline="true" :model="certificateFormInline"  ref="certificateFormInline" class="certificate-form-inline">
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="姓名"  prop="fwUserPo.userId" label-width="100px" >
                                    <el-select v-model="certificateFormInline.fwUserPo.userId" filterable  placeholder="请选择用户" style="width: 170px">
                                        <el-option
                                                v-for="item in fwUserPos"
                                                :key="item.userId"
                                                :label="item.userCnName"
                                                :value="item.userId">
                                        </el-option>
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="身份证号"  prop="idNumber" label-width="100px">
                                    <el-input v-model="certificateFormInline.idNumber" placeholder="身份证号" style="width: 170px"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="资质证书"  prop="certificate" label-width="100px">
                                    <el-input v-model="certificateFormInline.certificate" placeholder="资质证书" style="width: 170px"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="证书编号"  prop="certificateNum" label-width="100px">
                                    <el-input v-model="certificateFormInline.certificateNum" placeholder="证书编号" style="width: 170px"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="发证机关"  prop="certificateAuth" label-width="100px">
                                    <el-input v-model="certificateFormInline.certificateAuth" placeholder="发证机关" style="width: 170px"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="发证日期"  required label-width="100px" prop="certificateDate">
                                    <el-date-picker
                                            v-model="certificateFormInline.certificateDate"
                                            align="right"
                                            type="date"
                                            placeholder="选择日期"
                                            :picker-options="pickerOptions1" style="width: 170px">
                                    </el-date-picker>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="有效期至"  required label-width="100px" prop="certificateIndate">
                                    <el-date-picker
                                            v-model="certificateFormInline.certificateIndate"
                                            align="right"
                                            type="date"
                                            placeholder="选择日期"
                                            :picker-options="pickerOptions1" style="width: 170px">
                                    </el-date-picker>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="备注"  prop="remarks" label-width="100px">
                                    <el-input v-model="certificateFormInline.remarks" placeholder="备注" style="width: 170px"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-form>

                </template>
                <template slot="formBtn">
                    <el-button  @click="clearCertificate()">取 消</el-button>
                    <el-button type="primary" @click="saveCertificate()">确定保存</el-button>
                </template>
            </kf-table>

            <!--上传资质文件-->
            <el-dialog :visible.sync="uploadFormVisible"
                       title="上传文件"
                       size="tiny">
                <el-form :inline="true" ref="certificateUpload"  :model="uploadDate.fileList" class="certificateUpload-form-inline">
                        <el-upload
                                class="upload-demo"
                                ref="upload"
                                action="/dam/api/flightCrewMgr/upload"
                                show-file-list=false
                                auto-upload=false
                                :on-success="uploaded"
                                :on-preview="handlePreview"
                                :on-remove="handleRemove"
                                :on-change="handleChange"
                                :file-list="uploadDate.fileList"
                                :auto-upload="false"
                                :data="uploadDate">
                            <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
                            <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload" style="float: right">上传</el-button>
                    </el-upload>
                </el-form>
            </el-dialog>


            <!--查看资质文件-->
            <el-dialog :visible.sync="checkFileFormVisible"
                       title="查看证书"
                       size="tiny">
                <el-table
                        :data="fileData"
                        border
                        style="width: 100%">
                    <el-table-column
                            prop="fileName"
                            label="文件名" width="230">
                    </el-table-column>
                    <el-table-column
                            label="操作" >
                        <template scope="scope">
                                <a :href="scope.row.fileUrl" target="_blank">查看证书</a>
                            <el-button type="text" size="small" @click="delectCertificateFile(scope)">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </el-dialog>
        </div>

    </div>
</div>